<template>
	<el-col :span="componentModel.col*6" style="text-align: center;width:100%;border:1px solid #ddd;margin-top: 10px;">
		<div style="text-align: left;border-bottom: 1px solid #ddd;">{{componentModel.title}}</div>
		<el-row>
			<el-col :span="24/componentModel.cols" v-for="item in dataList" :key="item.value" @click="onItemClickHandler(item)">
				<img src='../assets/menu-item.png' style="width:28px;height:28px;" />
				<div>{{item.name}}</div>
			</el-col>
		</el-row>
	</el-col>
</template>

<script>
	import utils from '@/utils/utils.js';
	import constants from '@/utils/constants.js';
	export default {
		name: "ShortcutMenuComponent",
		props: ["componentModel"],
		data() {
			return {
				dataList:[]
			}
		},
		inject:['children'],
		mounted() {
			this.children.push(this);
		},beforeUnmount() {
			utils.removeArrayElement(this.children,this);
		},
		methods: {
			setProp(prop) {
				if(prop["data"]!=undefined){
					this.dataList=prop["data"];
				}
			},onItemClickHandler(item){
				var that = this;
				this.axios.get(constants.ROOT_URL + "webide/getPageCodeByMenuCode?menuCode=" + item.value).then(
					function(response) {
						if (response.data.code == 1) {
							if(that.$store.state.webIDE!=null){
								that.$store.state.webIDE.$refs.mainPageContainer.loadPage({
									"name": item.name,
									"menuType": response.data.menuType,
									"pageCode": response.data.pageCode
								});
							}else if(that.$store.state.userMain!=null){
								that.$store.state.userMain.$refs.mainPageContainer.loadPage({
									"name": item.name,
									"menuType": response.data.menuType,
									"pageCode": response.data.pageCode
								});
							}							
						} else {
							that.$alert(response.data.message, '提示')
						}
					});
			}
		},
	}
</script>

<style>
</style>
